import './App.css'
// import React, { useState } from 'react'
// import MyModal from './components/modal/MyModal';
// import LazyCom from './components/lazy/LazyCom'

function App() {

  // const [visiabled, setVisiabled] = useState(false)

  // const showModal = () => {
  //   setVisiabled(true)
  // }
  // const hideModal = () => {
  //   setVisiabled(false)

  // }
  return (
    <div className="App">
      {/* modal效果 */}
      {/*  <button type='button' onClick={showModal}>显示modal</button>
      {
        visiabled === true ?
          <MyModal>
            <div className="modal" onClick={hideModal}>
              <div className='modal-header'><h1>这是一个modal</h1></div>
              <div className='modal-body'></div>
              <div className='modal-footer'>
                <button type='button' onClick={hideModal}>确定</button>
                <button type='button' onClick={hideModal}>取消</button>
              </div>

            </div>
          </MyModal>
          : null
      } */}

      {/* 懒加载效果 */}
      {/* <LazyCom /> */}

    </div>
  );
}

export default App;

